<template>
  <div class="yongqianxuzhi">
    <top></top>
    <div class="flex zhiboxitong_content">
      <div class="left">
        <left></left>
      </div>
      <div class="right">
        <div style="font-size: 22px; margin-bottom: 20px; text-align: center; font-weight: bold;margin-top: 15px;">敢探号商城用前须知</div>
        <div class="zhiboxitong_right">
          <div style="color: #333333;font-size:18px;font-weight:bold; margin:20px 0 10px 0px;">系统功能</div>
          <div style="line-height: 30px; margin-bottom: 20px;font-size:14px;color:#333333">
             <div>敢探号商城类似于有赞等网络销售平台，为商家基于在敢探号发布的商品生成一个销售页面，支持商家 快速创建<b>直播店铺（多商品页面）</b>和<b>信息流推广（单商品）</b>两种模式的H5页面。</div>
             <div>1、快速生成多个H5商城（单商品下单）页面、并简单装修</div>
             <div>2、用户可以定制商品下单信息填写内容（身份证信息、验证码下单、国政通效验等）</div>
             <div>3、详细的订单管理功能（已支付申请退款等）用户可跟踪自己的订单情况</div>
             <div>4、可跟踪页面投放数据UV\PV\下单数等</div>
             <div>5、支持订单支付（需准备收款账户）</div>
          </div>

          <div style="color: #333333;font-size:18px;font-weight:bold; margin:30px 0 10px 0px;">使用前须知</div>
          <div style="font-size: 14px; margin:10px 0 20px 0; font-weight: bold;">1、关于域名准备</div>
          <div style="margin-bottom: 10px;font-size:14px;color:#333333">部分信息流推广需要自己公司主体备案的域名网址才能投放，抖音快手等直播平台都需要投放主体备案的域名。如果您已经有自己主体备案的域名则不再需要申请新的域名（我们使用二级域名，不影响该域名当前的网站访问）。</div>

          <div style="margin-bottom: 20px;font-size:14px;color:#333333">您需要给我们提供域名nignx版的ssl证书,下图是以阿里云为例的证书获取路径</div>
          <div style="margin: 20px;">
            <img src="../../static/img/buyingx1.png" style="max-width: 80%;" />
          </div>
          <div style="margin: 20px;">
            <img src="../../static/img/buyingx2.png" style="max-width: 80%;" />
          </div>
          
          <div style="font-size: 14px; margin:10px 0 20px 0; font-weight: bold;">2、关于支付账户准备</div>
          <div style="margin-bottom: 20px;font-size:14px;color:#333333">如果您需要用户支付订单，需申请支付宝或微信支付的相关支付业务（只有商户企业号可以）</div>
          <div style="font-size: 14px; margin-bottom: 20px; color: #333;">支付宝申请：</div>
          <div style="margin: 20px;">
            <img src="../../static/img/zhifubao.png" style="max-width: 80%;" />
          </div>
          <div style="font-size: 14px; margin-bottom: 20px;color: #333;">微信申请：</div>
          <div style="margin: 20px;">
            <img src="../../static/img/weixin.png"  style="max-width: 80%;"/>
          </div>
          <div style="font-size: 14px; margin-bottom: 10px;  margin:10px 0 20px 0; font-weight: bold;colo">3、关于独立服务器</div>
          
          <div style="margin-bottom: 40px; line-height: 30px;font-size:14px;color:#333">您可以申请独立服务器用来支撑您的商城业务，我们推荐这种方式，因为共用服务器很容易发生访问量突然上升导致的服务器卡顿、宕机等问题，这会导致您的推广页面无法打开或打开缓慢，造成推广费用损失，所以如果需要大量的推广或稳定的环境，我们推荐您订购独立服务器支撑商城业务，服务器由我们统一托管维护，当有新的功能更新您的商城也会同步更新，您可随时查看服务器负载情况。</div>
          <div class="btn_down">
        <el-button style="width: 220px;height:48px; background: #3158F1; color: #fff;text-align: center; margin: 0 auto; cursor: pointer; border-radius: 14px;" @click="down">点我下载商城使用说明书</el-button>
         </div>         
        </div>

      </div>
    </div>
  </div>
</template>

<script>
  import axios from "axios";
  import top from "./components/top.vue";
  import left from "./components/left.vue";
  export default {
    components: {
      top,left
    },
    name: "yongqianxuzhi",
    data() {
      return {

      }
    },
    created() {

    },
    mounted() {

    },
    methods: {
      down:function(){
              const a = document.createElement('a');
            	a.setAttribute('download', '敢探号商城使用说明.pdf');
            	a.setAttribute('href', '/web/static/shiyongshuoming.pdf');
            	a.click();
      },
    }
  }
</script>

<style scoped lang="less">
.btn_down{
  display: flex;
  justify-content: center;
}
  .yongqianxuzhi {
    // background: #f2f2f2;
    min-height: 100vh;
    /deep/ .el-breadcrumb{ font-size: 16px;}
    *{ box-sizing: border-box;}
    .zhiboxitong_content{
      height: calc(100vh - 70px);
      .left{width: 210px;background: #FAFAFE;height: 100%;}
      .right{ width: calc(100vw - 220px);padding: 15px 0 0 20px;
       height: 100vh;
       overflow: auto;
        .zhiboxitong_right{
           background: #F8F9FD;border-top-left-radius: 30px; padding: 20px; height: calc(100vh - 85px); overflow: auto;
        }
        .zhiboxitong_table{ margin-top: 20px;}
      }
    }

    .flex {
      display: flex;
      flex-wrap: wrap;
    }

    .flexb {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
    }

    .flexc {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
    }

    .flexbc {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center;
    }

    .flexcc {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
    }
  }
</style>
